<template>
  <div class="Popout">
    <el-dialog
      title="添加素材"
      :visible.sync="addmaterial"
      v-if="addmaterial"
     :width="this.$store.getters.offsetWidth"
      class="addStyel"
      @close="DirectlyToComplete"
      v-dialogDrag
      ref="dialog__wrapper"
      :close-on-click-modal="false"
    >
      <div class="dialog-body">
        <div class="line">
          <el-form ref="form" :model="addformList" label-width="110px">
            <el-form-item label="添加素材类型" style="position: relative;">
                 <el-row :gutter="20" style="display:flex">
                <el-col :sm="24" :md="12" :lg="12">
              <el-select
                v-model="addformList.region"
                placeholder="请选择"
                style="width:70%"
                @change="changeAddformList"
              >
                <!-- <el-option label="文件夹" value="0"></el-option> -->
                <el-option label="图片" value="1"></el-option>
                <el-option label="视频" value="2"></el-option>
                <el-option label="文本" value="3"></el-option>
                <el-option label="网址" value="4"></el-option>
                <el-option label="直播源" value="5"></el-option>
                <el-option label="安装包" value="6"></el-option>
              </el-select>
              <!-- <el-button style="background-color: #4d9ce0;color:#fff;">添加文件</el-button> -->
               </el-col>
                <el-col :sm="24" :md="12" :lg="12">
              <el-upload
                v-if="!streaming"
                ref="upload"
                action="https://jsonplaceholder.typicode.com/posts/"
                :on-change="beforeAvatarUpload"
                :on-preview="handlePreview"
                :before-remove="beforeRemove"
                multiple
                :auto-upload="false"
                :http-request="checkedFile"
                :on-exceed="handleExceed"
                :accept="isAccept"
              >
                <!-- :limit="3" -->
                <el-button size="small" type="primary" v-if="buttonDisabled">添加素材</el-button>
              </el-upload>
             </el-col>
              </el-row>
            </el-form-item>
            <el-table
              border
              :data="fileList"
              style="width: 100%"
              stripe
              v-if="!streaming"
              height="250"
              :size="GlobalVar.sizeSet.table"
            >
              <el-table-column type="index" label="序号"></el-table-column>
              <el-table-column label="文件名" prop="name" show-overflow-tooltip></el-table-column>
              <el-table-column prop="size" label="大小" show-overflow-tooltip></el-table-column>
              <el-table-column label="状态" show-overflow-tooltip>
                <template slot-scope="scope">
                  <div :style="{color: scope.row.ispass==='已经上传'?'#67c23a':(scope.row.ispass==='上传失败'?'red':'#409eff')}">{{scope.row.ispass}}</div>
                </template>
              </el-table-column>
              <el-table-column prop="handle" label="操作">
                <template slot-scope="scope">
                  <el-button :size="GlobalVar.sizeSet.btn" type="primary" @click="beforeRemove(scope.row)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
            <div class="establish_reminder" v-if="establish">上传完成，是否添加到新建文件夹？</div>
            <el-form-item
              class="formButton"
              style="text-align: center;"
              v-if="!streaming"
              label-width="0"
            >
              <el-button
                style="background-color: #4d9ce0;color: #fff;margin-top: 30px;"
                @click="submitUpload"
                v-if="!establish"
              >开始上传</el-button>

              <div v-if="establish">
                <el-button
                  style="background-color: #4d9ce0;color: #fff;margin-top: 10px; padding:12px 20px;"
                  @click="DirectlyToComplete"
                >否，直接完成</el-button>
                <el-button style="margin-left: 40px" @click="additionNews">添加到新文件夹</el-button>
              </div>
            </el-form-item>
          </el-form>
          <el-form ref="formEstablish" v-if="streaming" style="height:326px">
            <el-form-item label="素材名称" label-width="110px">
              <el-input v-model="streamingInput.name"></el-input>
            </el-form-item>
            <el-form-item :label="addformList.region==4?'网址':'直播源'" label-width="110px">
              <el-input v-model="streamingInput.site"></el-input>
            </el-form-item>
            <div class="establish_reminder" v-if="liveFolder">上传完成，是否添加到新建文件夹？</div>
            <el-form-item style=" text-align: center;" label-width="0">
              <el-button
                style="background-color: #4d9ce0;color:#fff;padding:12px 10%;"
                @click="submitStreaming"
                v-if="!liveFolder"
              >提 交</el-button>
              <div v-else>
                <el-button
                  style="background-color: #4d9ce0;color: #fff;margin-top: 10px; padding:12px 20px;"
                  @click="DirectlyToComplete"
                >否，直接完成</el-button>
                <el-button style="margin-left: 40px" @click="additionNews">添加到新文件夹</el-button>
              </div>
            </el-form-item>
          </el-form>
          <div>
            <h3 style="font-weight: 400;color:#333;">
              上传文件类型要求
              <span style="color:red">*</span>
            </h3>
            <ul class="footText">
              <li>图片类型：jpeg、jpg</li>
              <li>视频类型：mp4、avi</li>
              <li>文本类型：txt</li>
              <li>安装包类型：apk，并且安装包命名必须是：XXX-版本号.apk,如PsClient-1.0.1.apk。“-”符号只能有一个。</li>
            </ul>
          </div>
        </div>
      </div>
    </el-dialog>

  </div>
</template>

<script>
import moment from "moment";
import axios from 'axios'
export default {
  name: "Popout",
  props: {
    dialogVisible: {
      //这个就是父组件中子标签自定义名字
      required: true,
    },
    addVisible: {
      required: true,
    },
    materialId: {
      required: true,
    },
  },
  data() {
    return {
      streamingInput: {
        name: "",
        site: "",
      },
      Establishprogram: false,
      status: "",
      fileList: [],
      IsShowPage: this.dialogVisible,
      addmaterial: this.addVisible,
      isPass: true,
      addformList: {
        name: "",
        region: "",
        desc: "",
        infoText: "",
        auditStatus: "",
      },
      Tiemvalue: "",
      id: "",
      // 已经成功隐藏按钮
      ifbutton: false,
      // 判断是不是直播源和网址
      streaming: false,
      // 添加数据后是否加入新建文件夹
      establish: false,
      ForTheTimeBeing: [],
      // 判断新上传直播源网址是否新建文件夹
      liveFolder: false,
      // 判断上传文件的类型
      isAccept: "",
      // 判断有没有选类型
      buttonDisabled: false,
      ifsuccess: {
        ispass: "等待上传",
      },
       maxSize: 5 * 1024 * 1024 * 1024, // 上传最大文件限制
      multiUploadSize: 500 * 1024 * 1024, // 大于这个大小的文件使用分块上传(后端可以支持断点续传)
      eachSize: 500 * 1024 * 1024, // 每块文件大小
      requestCancelQueue: [], // 请求方法队列（调用取消上传
      getUploadProcessTimer:'', //上传进度获取定时器
    };
  },
  created() {},
  destroyed(){
    if(this.getUploadProcessTimer){
      clearInterval(this.getUploadProcessTimer);
    }
  },
  watch: {
    addVisible(val) {
      if (val == false) {
        this.addmaterial = true;
      } else {
        this.addmaterial = true;
      }
      this.addformList.region = "";
    },
    // indexMethod(index) {
    //   return (this.query.page - 1) * this.query.pageSize + index + 1;
    // },
    dialogVisible(val) {
      if (val == false) {
        this.IsShowPage = true;
      } else {
        this.IsShowPage = true;
      }
      this.addformList.region = "";
    },
    materialId(val) {
      if (val) {
        this.id = val;
        this.getAmendData();
      }
    },
    addmaterial(val) {
      if (!val) {//窗口关闭 同时关闭定时器
        if(this.getUploadProcessTimer){
          clearInterval(this.getUploadProcessTimer);
        }
      }
    },
  },
  mounted() {
  },
  methods: {
    async checkedFile (options) {
      const { maxSize, multiUploadSize, getSize, splitUpload, singleUpload } = this
      const { file, onProgress, onSuccess, onError } = options
      if (file.size > maxSize) {
        return this.$message({
          message: `您选择的文件大于${getSize(maxSize)}`,
          type: 'error'
        })
      }
      const uploadFunc = file.size > multiUploadSize ? splitUpload : singleUpload
      try {
        await uploadFunc(file, onProgress)
        this.$message({
          message: '上传成功',
          type: 'success'
        })
        onSuccess()
      } catch (e) {
        console.error(e)
        this.$message({
          message: e.message,
          type: 'error'
        })
        onError()
      }
      const prom = new Promise((resolve, reject) => {})
      prom.abort = () => {}
      return prom
    },
    // closeAddmaterial() {
    //   this.liveFolder = false;
    //    this.establish = false;
    //   this.fileList = [];
    //   this.addformList.region = "";
    //   this.streaming = false;
    //   this.buttonDisabled = false;
    //   this.streamingInput.site = "";
    //   this.streamingInput.name = "";
    //    this.$emit("succeedUrl", true);
    //   // window.sessionStorage.removeItem("skipPath");
    // },
       // 格式化文件大小显示文字
    getSize (size) {
      return size > 1024
        ? size / 1024 > 1024
          ? size / (1024 * 1024) > 1024
            ? (size / (1024 * 1024 * 1024)).toFixed(2) + 'GB'
            : (size / (1024 * 1024)).toFixed(2) + 'MB'
          : (size / 1024).toFixed(2) + 'KB'
        : (size).toFixed(2) + 'B'
    },
    // 单文件直接上传
    singleUpload (file, onProgress) {
      return this.postFile({ file, uid: file.uid, fileName: file.fileName }, onProgress)
    },
    // 大文件分块上传
    splitUpload (file, onProgress) {
      return new Promise(async (resolve, reject) => {
        try {
          const { eachSize } = this
          const chunks = Math.ceil(file.size / eachSize)
          const fileChunks = await this.splitFile(file, eachSize, chunks)
          let currentChunk = 0
          for (let i = 0; i < fileChunks.length; i++) {
            // 服务端检测已经上传到第currentChunk块了，那就直接跳到第currentChunk块，实现断点续传
            if (Number(currentChunk) === i) {
              // 每块上传完后则返回需要提交的下一块的index
              currentChunk = await this.postFile({
                chunked: true,
                chunk: i,
                chunks,
                eachSize,
                fileName: file.name,
                fullSize: file.size,
                uid: file.uid,
                file: fileChunks[i]
              }, onProgress)
            }
          }
          const isValidate = await this.validateFile({
            chunks: fileChunks.length,
            fileName: file.name,
            fullSize: file.size,
            uid: file.uid
          })
          if (!isValidate) {
            throw new Error('文件校验异常')
          }
          resolve()
        } catch (e) {
          reject(e)
        }
      })
    },
    // 文件分块,利用Array.prototype.slice方法
    splitFile (file, eachSize, chunks) {
      return new Promise((resolve, reject) => {
        try {
          setTimeout(() => {
            const fileChunk = []
            for (let chunk = 0; chunks > 0; chunks--) {
              fileChunk.push(file.slice(chunk, chunk + eachSize))
              chunk += eachSize
            }
            resolve(fileChunk)
          }, 0)
        } catch (e) {
          console.error(e)
          reject(new Error('文件切块发生错误'))
        }
      })
    },
    // 提交文件方法,将参数转换为FormData, 然后通过axios发起请求
    postFile (param, onProgress) {
      const formData = new FormData()
      for (let p in param) {
        formData.append(p, param[p])
      }
      const { requestCancelQueue } = this
      const config = {
        cancelToken: new axios.CancelToken(function executor (cancel) {
          if (requestCancelQueue[param.uid]) {
            requestCancelQueue[param.uid]()
            delete requestCancelQueue[param.uid]
          }
          requestCancelQueue[param.uid] = cancel
        }),
        onUploadProgress: e => {
          if (param.chunked) {
            e.percent = Number(((((param.chunk * (param.eachSize - 1)) + (e.loaded)) / param.fullSize) * 100).toFixed(2))
          } else {
            e.percent = Number(((e.loaded / e.total) * 100).toFixed(2))
          }
          onProgress(e)
        }
      }
      for (let i = 0; i < this.fileList.length; i++) {
        formData.append("file", this.fileList[i].raw);
      }
      let token = window.sessionStorage.getItem("token");
      let skipPath = window.sessionStorage.getItem("skipPath");
      if (!skipPath) {
        skipPath = "/";
      } else {
        skipPath = skipPath.replace('"', "").replace('"', "");
      }
      formData.append("relativePath", skipPath);
      formData.append("zycmToken", token);
      return axios.post('/ftp/uploadMaterial3', formData, config).then(rs => rs.data)
    },
    // 文件校验方法
    validateFile (file) {
      // return axios.post('http://localhost:8888/validateFile', file).then(rs => rs.data)
    },

    DirectlyToComplete() {
      // window.sessionStorage.removeItem("skipPath");
      this.fileList = [];
      this.streamingInput.site = "";
      this.streamingInput.name = "";
      this.liveFolder = false;
      this.establish = false;
      this.streaming = false;
      this.addformList.region = "";
      this.streaming = false;
      this.$emit("succeedUrl", true);
      this.addmaterial = false;
      this.buttonDisabled = false;
    },
    // 添加到新文件夹
    additionNews() {
      // window.sessionStorage.removeItem("skipPath");
      this.fileList = [];
      this.$emit("submintList", this.ForTheTimeBeing);
      this.liveFolder = false;
      this.establish = false;
      this.buttonDisabled = false;
      this.addmaterial = false;
    },
    // 判断是不是网址直播源
    changeAddformList() {
      if (this.addformList.region == 4 || this.addformList.region == 5) {
        this.streaming = true;
      } else {
        this.streaming = false;
        this.buttonDisabled = true;
      }
      if (this.addformList.region == 1) {
        this.isAccept = ".jpg,.jpeg,.png";
      } else if (this.addformList.region == 2) {
        this.isAccept = ".AVI,.mov,.rmvb,.rm,.FLV,.mp4,.3G";
      } else if (this.addformList.region == 3) {
        this.isAccept = ".txt";
      } else if (this.addformList.region == 6) {
        this.isAccept = ".apk";
      }
      this.fileList = [];
      this.liveFolder = false;
      this.establish = false;
    },
    // 提交添加的网址直播源
    async submitStreaming() {
      if (!this.streamingInput.name) {
        this.$message({
          type: "warning",
          message: "请填写素材名称",
        });
        return;
      } else if (!this.streamingInput.site && this.addformList.region == 4) {
        this.$message({
          type: "warning",
          message: "请填写网址",
        });
        return;
      } else if (!this.streamingInput.site && this.addformList.region == 5) {
        this.$message({
          type: "warning",
          message: "请填写直播源",
        });
        return;
      }
      let token = window.sessionStorage.getItem("token");
      let skipPath = window.sessionStorage
        .getItem("skipPath")
        .substring(1, window.sessionStorage.getItem("skipPath").length - 1);
      let formData = new FormData();
      formData.append("fileName", this.streamingInput.name);
      formData.append("sourceUrl", this.streamingInput.site);
      formData.append("relativePath", skipPath);
      formData.append("materialType", this.addformList.region);
      formData.append("zycmToken", token);
      const { data: res } = await this.$http.post(
        "ftp/uploadMaterial2",
        formData
      );
      if (res.result == "success") {
        this.$message({
          type: "success",
          message: res.message,
        });
        this.ForTheTimeBeing.push(res.data);
        this.liveFolder = true;
      } else {
        this.$message({
          type: "error",
          message: res.message,
        });
      }
      this.liveFolder = false;
      this.addmaterial = false;
      // window.sessionStorage.removeItem("skipPath");
      this.streamingInput.name = "";
      this.streamingInput.site = "";
      this.streaming = false;
      this.addformList.region = "";
      this.$emit("succeedUrl", true);
    },
    // 修改素材
    async getAmendData() {
      let moment = require("moment");
      let token = window.sessionStorage.getItem("token");
      let formData = new FormData();
      formData.append("materialId", this.id);
      formData.append("zycmToken", token);
      const { data: res } = await this.$http.post(
        "material/selectByPrimaryKey",
        formData
      );
      if (res.data.effectiveTime) {
        this.Tiemvalue = moment(res.data.effectiveTime).format(
          "YYYY-MM-DD HH:mm:ss"
        );
      } else {
        this.Tiemvalue = "";
      }
      this.addformList.name = res.data.materialName;
      this.addformList.auditStatus = res.data.auditStatus;
      this.addformList.infoText = res.data.auditRemark;
      if (res.data.isPrivate == 0) {
        this.addformList.region = "共享";
      } else {
        this.addformList.region = "不共享";
      }
      if (res.data.auditStatus == 0) {
        this.addformList.auditStatus = "未审核";
        this.ifbutton = false;
      } else if (res.data.auditStatus == 1) {
        this.addformList.auditStatus = "审核通过";
        this.ifbutton = true;
      } else {
        this.addformList.auditStatus = "审核未通过";
        this.ifbutton = false;
      }

    },
    // 信息
    onSubmit() {
    },
    async beforeAvatarUpload(file) {
      if (file.name.length >= 104) {
        this.$message({
          type: "error",
          message: "素材名长度不能过长",
        });
        return;
      }
      if (this.establish) {
        this.fileList = [];
        this.establish = false;
      }
      let ifRepetition1 = [];
      let ifRepetition2 = [];
      // this.establish=true
      ifRepetition1.push(file);
      ifRepetition1.forEach((element) => {
        ifRepetition2.push(element.name);
      });
      let aa = ifRepetition2.toString();
      let token = window.sessionStorage.getItem("token");
      let formData = new FormData();
      formData.append("materialNames", aa);
      formData.append("type", this.addformList.region);
      formData.append("zycmToken", token);
      const { data: res } = await this.$http.post(
        "material/checkMaterialName",
        formData
      );
      if (res.data.length > 0) {
        this.$message({
          type: "error",
          message: "已有此素材",
        });
      } else {
        var flag = false;

        this.fileList.forEach((element, index) => {
          if (element.name == file.name) {
            this.$message({
              type: "error",
              message: "不能重复提交素材:" + repeatName.substring(1),
            });
            flag = true;
          }
          //  this.$set(element, "ispass", '等待上传');
        });

        // let arr11 = [];
        // arr11 = file.name.split("");
        if (file.name.indexOf(" ") >= 0) {
          this.$message({
            type: "warning",
            message: "素材名不能有空格",
          });
          flag = true;
        }
        // arr11.forEach(e2 => {
        //   if (e2 == " ") {
        //     this.$message({
        //       type: "warning",
        //       message: "素材名不能有空格"
        //     });
        //     flag = true;
        //   }
        // });
        if (!flag && this.fileList.length < 30) {
          file.size = this.getFileSize(file.size);
          file.ispass = "等待上传";
          this.fileList.push(file);
          flag = false;
          return;
        } else if (!flag && this.fileList.length > 30) {
          this.$message({
            type: "warning",
            message: "提交素材不能超过30个",
          });
          flag = false;
          return;
        }
      }
    },
    // 是否删除
    beforeRemove(row, file, fileList) {
      this.$confirm("是否确认删除" + row.name + "文件?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          for (let index = 0; index < this.fileList.length; index++) {
            if (this.fileList[index].name == row.name) {
              this.fileList.splice(index, 1);
              this.$message({
                type: "success",
                message: "删除成功!",
              });
            }
          }
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    handlePreview(file) {
    },
    // 文件个数限制
    handleExceed(files, fileList) {
      this.$message.warning(
        `当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
          files.length + fileList.length
        } 个文件`
      );
    },
    // 点击上传
    async submitUpload() {
      if (this.fileList.length == 0) {
        this.$message({
          type: "warning",
          message: "请选择需要上传的数据",
        });
        return;
      } else if (this.fileList.length > 10) {
        this.$message({
          type: "warning",
          message: "每次最多上传10个素材文件",
        });
        return;
      }
      let formData = new FormData();
      for (let i = 0; i < this.fileList.length; i++) {
        formData.append("file", this.fileList[i].raw);
      }
      let token = window.sessionStorage.getItem("token");
      let skipPath = window.sessionStorage.getItem("skipPath");
      if (!skipPath) {
        skipPath = "/";
      } else {
        skipPath = skipPath.replace('"', "").replace('"', "");
      }
      formData.append("relativePath", skipPath);
      formData.append("zycmToken", token);
      formData.append("showProgress", 1);//开启进度条

      //开始上传前开启定时器扫描上传进度
      let formData2 = new FormData();
      //formData2.append("openLoading", 0);
      this.getUploadProcessTimer = setInterval(() => {
        this.getUploadProcess(formData2);
      },3000);

      // formData.append("file", file);
      const { data: res } = await this.$http.post(
        "ftp/uploadMaterial3",
        formData
      );

      if (res.result == "success") {
        this.$nextTick(() => {
          this.$message({
            type: "success",
            message: res.message,
          });
          this.establish = true;
          this.status = true;
          this.ForTheTimeBeing = res.data;
          // let arr = [];
          // arr = this.fileList;
          // this.fileList = [];
          this.fileList.forEach((eee, i) => {
            delete eee.ispass;
            this.$set(eee, "ispass", "已经上传");
          });
          // this.fileList = arr;
        });
      } else {
        if(res.result === "fail"){
           this.$message({
            type: "error",
            message: res.data.join(","),
          });
        }else{
           this.$message({
            type: "error",
            message: res.message,
          });
        }
        //多文件上传时 可能部分已经上传完成 需要再更新一次进度
        setTimeout(() => {
          this.getUploadProcess2(formData2,true);
        },1000);
      }

      //关闭定时进度获取
      clearInterval(this.getUploadProcessTimer);
    },
    async getUploadProcess2(formData,isLastTime){//获取上传进度
      const { data: res } = await this.$http.post('ftp/process',formData);
      if (res.result == "success") {
        if(res.data && res.data.length > 0){
          this.fileList.forEach((eee, i) => {
            //处理上传文件的后缀主要是视频和文本 视频统一转换mp4 文本统一转换成txt
            let name = "";
            if (this.addformList && this.addformList.region == 2){
              name = eee.name.substr(0,eee.name.lastIndexOf("."))+".mp4";
            } else if(this.addformList && this.addformList.region == 3){
              name = eee.name.substr(0,eee.name.lastIndexOf("."))+".txt";
            }

            for (let j = 0; j < res.data.length; j++) {
              let name2 = res.data[j].remoteFilename;
              if(name === name2){
                delete eee.ispass;
                if(res.data[j].percent.substr(0,2) === '99'){//百分之99默认上传完成
                  this.$set(eee, "ispass", "已经上传");
                }else{
                  this.$set(eee, "ispass", res.data[j].percent);
                }
                break;
              }else{
                //最后一次核对上传进度时 显示上传失败
                if(isLastTime && j+1 >= res.data.length){
                  delete eee.ispass;
                  this.$set(eee, "ispass", "上传失败");
                  break;
                }
              }
            }
          });

        }
      }else{
        //console.log("获取上传进度异常 "+res.message);
      }
    },
    getUploadProcess(formData){
      this.getUploadProcess2(formData,false);
    },
    isPassClick(e) {
      this.isPass = !this.isPass;
    },
    getFileSize(fileByte) {
      var fileSizeByte = fileByte;
      var fileSizeMsg = "";
      if (fileSizeByte < 1048576)
        fileSizeMsg = (fileSizeByte / 1024).toFixed(2) + "KB";
      else if (fileSizeByte == 1048576) fileSizeMsg = "1MB";
      else if (fileSizeByte > 1048576 && fileSizeByte < 1073741824)
        fileSizeMsg = (fileSizeByte / (1024 * 1024)).toFixed(2) + "MB";
      else if (fileSizeByte > 1048576 && fileSizeByte == 1073741824)
        fileSizeMsg = "1GB";
      else if (fileSizeByte > 1073741824 && fileSizeByte < 1099511627776)
        fileSizeMsg = (fileSizeByte / (1024 * 1024 * 1024)).toFixed(2) + "GB";
      else fileSizeMsg = "文件超过1TB";
      return fileSizeMsg;
    },
  },
};
</script>



<style lang="stylus" scoped>
.establish_reminder {
  text-align: center;
  color: #333;
  padding: 15px 0 0;
}
// .materialMessage {
.ifpass {
  position: absolute;
  right: 0;
  top: 0;
  width: 40%;
  cursor: pointer;
  margin: 0 0 0 20px;
  text-align: center;
}
.addClass {
  background-color: #4d9ce0 !important;
  color: #fff !important;
}
.formButton {
  text-align: center;
  // padding-right: 10%;
  // padding-top: 20px;
  // .el-button {
  //   width: 100px;
  // }
}
.opinion {
  /deep/.el-form-item__label {
    height: 80px;
    line-height: 80px;
  }
}
/deep/.el-textarea__inner {
  height: 80px;
}
/deep/.el-date-editor.el-input,
.el-date-editor.el-input__inner {
  width: 100%;
}
/deep/.el-form-item__label {
  background-color: #efefef;
  border-radius: 0;
  height: 40px;
  border: 1px solid #dcdfe6;
  border-right: none;
  box-sizing: border-box;
  text-align: center;
  padding-left: 10px;
}
// }
// 添加素材样式
.addStyel {
  /deep/.el-form-item__label {
    background-color: #efefef;
    border-radius: 0;
    height: 40px;
    border: 1px solid #dcdfe6;
    border-right: none;
    box-sizing: border-box;
    text-align: center;
    padding-left: 10px;
  }
  /deep/.el-table th,
  .el-table tr {
    background-color: #fafafa;
  }
  .footText {
    background-color: #fafafa;
    padding: 10px;
    border-top: 1px solid #ccc;
    line-height: 25px;
  }
  /deep/.el-upload {
    position: absolute;
    right: 5%;
    top: 0;
    width: 80px;
    /deep/.el-button {
      background-color: #4d9ce0;
      color: #fff;
    }
  }
  // /deep/.el-table__empty-text{
  //   display: none
  // }
}
/deep/.el-dialog__header {
  background-color: #efefef;
  padding: 0;
  line-height: 50px;
  padding-left: 20px;
  color: #333;
  font-size: 16px;
}

/deep/.el-input__inner,
/deep/.el-textarea__inner {
  border-radius: 0;
}
/deep/.el-upload-list {
  display: none;
}
</style>
